<template>
    <div>
        <ul class="homehead">
            <li>
                <img v-bind:src="$store.getters.user.headimgurl" class="headimg" v-on:click="ucenter=true">
            </li>
            <li>
               {{$store.getters.user.nickname}}
            </li>
        </ul>
        <van-popup v-model="ucenter" position="right" class="v-full" :overlay="false">
            <UCenter :callback="closePopup" :popup="true"></UCenter>
        </van-popup>
    </div>
</template>

<script>
import { Popup } from 'vant';

import UCenter from 'touch/components/home/ucenter';
export default {
    components: {
        [Popup.name] : Popup,
        UCenter,
    },
    data () {
        return {
            ucenter : false,
        }
    },
    methods :{
        closePopup(){
            this.ucenter = false;
        }
    },
    created: function(){
        //获取用户基本信息
        this.Axios.Home.BaseInfo()
        .then(res =>{
            if(!res) return false;
            var data = res.data;
            this.$store.dispatch('SET_USER',data);
        })
    },
}
</script>
<style>
    .homehead{width: 100%;height: 130px;background-color: #ded8c8;}
    .homehead {list-style: none; color: white;}
    .homehead li{float: left;margin-left: 15px;line-height: 120px;}
    .homehead .headimg{border-radius: 50%; width: 80px;height: 80px;margin-top: 20px;}
</style>